<template>
<div>
    <a-tabs type="card">
    <a-tab-pane key="1" tab="转运手基本信息">
    </a-tab-pane>
    </a-tabs>
    <a-row>
      <a-col :span="4">
        <img v-bind:src="Rider.img" style="width:90%">
      </a-col>
      <a-col :span="4">
        姓名 <br>
        手机 <br>
        身份证 <br>
        编号 <br>
        所属CP <br>
        所在市场<br>
        注册时间<br>
      </a-col>
      <a-col :span="6">
        {{Rider.rdname}} / {{Rider.nickname}}<br>
        {{Rider.mobile}}<br>
        {{Rider.id_card}}<br>
        {{Rider.code}}<br>
        {{Rider.cp_id}}<br>
        {{Rider.market_id}}<br>
        {{Rider.create_time}}<br>
      </a-col>
      <a-col :span="10">

      </a-col>
    </a-row>
    <p></p>
    <p></p>
    <a-tabs type="card">
    <a-tab-pane key="1" tab="转运手状态">
    </a-tab-pane>
  </a-tabs>
  <a-row>
    <a-col :span="4">

    </a-col>
  <a-col :span="10">
        转运手状态管理
        <a-divider type="vertical" />
        <a-button type="link">审核（未实现）</a-button>
        <a-button type="link">冻结（未实现）</a-button>
        <br><br>
  </a-col>
  <a-col :span="10">

  </a-col>
  </a-row>
  <a-row>
    <a-col :span="4">

    </a-col>
  <a-col :span="4">
        运营状态<br>
        资格审核 <br>
        身份证认证 <br>
  </a-col>
  <a-col :span="6">
        {{getStatusToStr(Rider.status)}}<br>
        {{getIsValidStr(Rider.is_valid)}}<br>
        {{Rider.verify_status}}<br>
  </a-col>
  <a-col :span="10">

  </a-col>
  </a-row>
</div>
</template>

<script>

import rider_api from "@/api/rider"
import day from "@/utils/day";

export default{
  data() {
    return {
        Rider: {
        },
        RiderID: Number(this.$route.params.riderID),
        loading: false,
    }
  },
  mounted() {
      console.log("Lets fetch...",this.RiderID);
      this.fetch(this.RiderID);
      console.log("after fetch...",this.RiderID);
  },
  methods: {
    fetch(id) {

      rider_api.queryDataByID(id)
        .then((response) => {
            let riderTmp = {
              id: Number(response.data.id),
              img: response.data.img_head,
              rdname: response.data.name,
              nickname: response.data.nickname,
              mobile: response.data.mobile,
              id_card: response.data.id_card,
              code: response.data.code,
              cp_id: response.data.cp_id,
              status: response.data.status,
              is_valid: response.data.is_valid,
              verify_status: response.data.verify_status,
              create_time: day.FormatDate(response.data.create_time,"YYYY-MM-DD HH:mm")

            }
            this.Rider = {...riderTmp};
            this.loading = true;
        });
    },

    getIsValidStr(isValid){
      return rider_api.isValidToStr(isValid);
    },

    getStatusToStr(status){
      return rider_api.statusToStr(status);
    },
  }
}
</script>

<style lang="less" type="text/less" scoped>
.changeGhost li {
  list-style: none;
  padding: 6px;
}
.changeGhost li:nth-child(2n-1) {
  background: #f8f8f8;
}
.ghost {
  opacity: 0.5;
  background: #c8ebfb !important;
}
.changeDiv {
  cursor: pointer;
}
.hide_action {
  display: none;
  padding-left: 10px;
  .action {
    padding-left: 4px;
  }
}
</style>
